<template>
	<view class="hui">
		<u-navbar leftIconColor="#fff" :left-text="text" :autoBack="true" title=" " titleStyle="color:#fff"
			:placeholder="true" bgColor="#3C7CFF">
		</u-navbar>
		<view class="box">
			<view class="list_box">
				<view class="head_box b_flex_c">
					<view class="text_box">
						<view class="b_blue name" v-if="info.complete">{{info.leaseTimes}}</view>
						<view class="b_orange name" v-else-if="info.timeout">{{fen}}</view>
						<view class="b_blue name" v-else>{{fen}}</view>
						<view class="b_grey msg">使用时长</view>
					</view>
					<view class="text_box">
						<view class="b_blue name" v-if="info.complete">{{info.price}}元</view>
						<view class="b_blue name" v-else>订单正在进行中</view>
						<view class="b_grey msg">产生费用</view>
					</view>
				</view>
				<view class="info_box b_grey">
					<view class="b_flex_c_s i_box b_border_b">
						<view>医院名称</view>
						<view>{{info.hospitalName}}</view>
					</view>
					<view class="b_flex_c_s i_box b_border_b">
						<view>设备编号</view>
						<view>{{info.deviceNumber}}</view>
					</view>
					<view class="b_flex_c_s i_box b_border_b">
						<view>价格类型</view>
						<view>{{info.chargingMethodText}}</view>
					</view>
					<view class="b_flex_c_s i_box b_border_b">
						<view>使用价格</view>
						<view>{{info.price}}元</view>
					</view>
					<view class="b_flex_c_s i_box b_border_b">
						<view>开始时间</view>
						<view>{{info.createTime}}</view>
					</view>
					<view class="b_flex_c_s i_box b_border_b">
						<view>结束时间</view>
						<view v-if="info.completeTime">{{info.completeTime}}</view>
						<view v-else>-</view>
					</view>
					<view class="b_flex_c_s i_box">
						<view>使用状态</view>
						<view class="b_orange" v-if="info.timeout">已超时</view>
						<view class="b_gray" v-else>{{$project.setState(info.complete)}}</view>
					</view>
				</view>
				<view class="button_box" v-if="!info.complete">
					<view class="pay_button b_m_bs" @click="submit(2)">应急开锁</view>
					<view class="pay_button" @click="submit(1)">关锁还床</view>
				</view>
			</view>

		</view>

	</view>
</template>

<script>
	import {
		deviceOrderInfo
	} from "@/require/api.js";
	export default {
		data() {
			return {
				params: {
					id: ''
				},
				info: {},
				text: '',
				fen: ''
			}
		},
		onLoad(data) {
			this.params.id = data.id;
		},
		onShow() {
			this.$blue.openBluetoothAdapter();
			this.getInfo();
		},
		methods: {
			toBlue(){
			
				let _=this;
				uni.showModal({
					title:'确认是否应急开锁?',
					success: (res) => {
						if(res.confirm){
							let mac=_.info.mac;
							let deviceId='';
							if(!_.$store.state.macList[mac]){
								return _.$project.toast('打开蓝牙和定位，请稍后再试');
							}else{
								 deviceId=_.$store.state.macList[mac];
							}
							_.$store.commit('setType', 3);
							uni.showLoading({
								title: '开锁中,请勿远离设备...'
							})
							_.$blue.createBLEConnection(deviceId);
						}
					}
				})
			},
			submit(type) {
				let _ = this;
			     uni.authorize({
			     	scope:"scope.userLocation",
			     	success:function(res){
			     		_.$blue.openBluetoothAdapter();
			     		console.log(res);
						if(type==1){
							_.close();
						}else{
							_.toBlue();
						}
			     		
			     	},
			     	fail:function(error){
			     		console.log(error);
			     		errorAdd({msg: JSON.stringify(error)});
			     		_.$project.isLocation();
			     	}
			     })
			},
			close() {
			
				let _ = this;
				let blue=this.$blue;
			
				uni.showModal({
					title: '确认是否关锁还床?',
					success(res) {
						if (res.confirm) {

							let mac = _.info.mac;


                             let deviceId='';
							 console.log(_.$store.state.macList);
                             if(!_.$store.state.macList[mac]){
                             	return _.$project.toast('打开蓝牙和定位，请稍后再试');
                             }else{
                             	 deviceId=_.$store.state.macList[mac];
                             }

							/* if (!_.$project.inObjectArray({
									deviceId: mac
								}, _.$store.state.devices, 'deviceId')) {
								return _.$project.toast('设备未找到,请稍后重试');
							} */

							_.$store.commit('setType', 2);
							uni.showLoading({
								title:'关锁中,请勿远离设备...'
							})
							blue.createBLEConnection(deviceId);
							
						}
					}
				})
			},
			setFen() {
				let info=JSON.parse(JSON.stringify(this.info));
				let end = new Date();
				let start = new Date(info.createTime.replace(/-/g, '/'));			 
				this.fen=this.$project.getDhm(start,end);
			},
			getNow() {

				setInterval(() => {
					this.setFen();
				}, 1000)
			},
			async getInfo() {
				let {
					data
				} = await deviceOrderInfo(this.params);
				this.info = data;
				this.setFen();
				this.getNow();
				if (data.complete) {
					this.text = '已完成';
				} else {
					this.text = '使用中';
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		height: 500rpx;
		background: linear-gradient(#3C7CFF, #F8F8F8);
	}

	.list_box {

		box-sizing: border-box;

		padding: 30rpx 0;
	}

	.head_box {
		background-color: #fff;
		width: 94%;
		border-radius: 15rpx;
		box-sizing: border-box;
		padding: 40rpx;
		margin: 0 auto 30rpx auto;
	}

	.text_box {
		width: 50%;
		text-align: center;
	}

	.name {
		font-size: 38rpx;
		font-weight: bold;
		margin-bottom: 30rpx;
	}

	.msg {
		font-size: 30rpx;
	}

	.info_box {
		width: 94%;
		margin: 0 auto;
		background-color: #fff;
		border-radius: 15rpx;
		box-sizing: border-box;
		padding: 0 30rpx;
	}

	.i_box {
		box-sizing: border-box;
		padding: 40rpx 0;
	}

	.button_box {
		background-color: #F4F4F4;
		box-sizing: border-box;
		padding: 150rpx 3% 20rpx 3%;
	}

	.pay_button {
		width: 100%;
		text-align: center;
		height: 75rpx;
		line-height: 75rpx;
		background-color: #3C7CFF;
		color: #fff;
		width: 100%;
		border-radius: 50rpx;
	}
</style>